<template>
  <view class="feedback-detail">
    <view class="textarea-wrapper">
      <textarea
        name=""
        id=""
        cols="30"
        rows="10"
        maxlength="200"
        v-model="content"
        class="input"
        placeholder-style="font-size: 28upx;font-weight: 500;color: #999999;"
        placeholder="请输入您的问题反馈，我们会更加改进"
      ></textarea>
      <view class="textarea-text">
        {{ content == "" ? 0 : content.length }}/200
      </view>
    </view>
    <view class="btn-wrapper">
      <button class="add-btn" @tap="handleClick">提交</button>
    </view>
  </view>
</template>

<script>
import { feedback } from "@/api/userInfo";
export default {
  data() {
    return {
      content: "",
    };
  },
  onLoad(options) {},
  methods: {
    async handleClick() {
      if (this.content) {
        await this.$http
          .post(feedback, { content: this.content })
          .then((r) => {
            console.log(r);
            if (r.code && r.code == 200) {
              this.$mRouter.reLaunch({ route: "/pages/profile/profile" });
            }
          })
          .catch((e) => {
            console.log(e);
          });
      }
    },
  },
};
</script>

<style lang="scss">
page {
  background-color: #f9f9f9;
}
.feedback-detail {
  .textarea-wrapper {
    height: 458upx;
    background: #ffffff;
    border-top: 1upx solid #eee;
    padding: 30upx;
  }
  textarea {
    height: 328upx;
  }
  .textarea-text {
    color: #999999;
    font-size: 24upx;
    text-align: right;
    font-weight: 500;
    padding-bottom: 10upx;
    border-bottom: 1upx solid #eee;
  }
  .btn-wrapper {
    margin: 80upx 30upx;
    .add-btn {
      background: #f91c1c;
      border-radius: 40upx;
      font-size: 30upx;
      font-family: PingFang SC;
      font-weight: 500;
      color: #ffffff;
    }
  }
}
</style>
